@extends('admin.app')
@section('content')
    <link rel="stylesheet" href="/css/admin/full-information.css">
    <div class="full-information">
        <div class="full-top weui-cell">
            <div class="weui-cell__hd">
                <img class="full-topimg" src="/images/admin/full-inforlogo1.png">
            </div>
            <div class="weui-cell__bd">
                <img class="question-btn" src="/images/admin/full-infor1.png">
                <p class="color-gray btn-p">上传图片<span class="right-icon"></span></p>
            </div>
        </div>
            <div class="weui-cells weui-cells_form" >
                <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label color-gray">企业名称</label></div>
                    <div class="weui-cell__bd">
                        <div class="needsclick company-name" contenteditable="true"  id="name" placeholder='请输入企业名称'></div>
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label color-gray">宣传语</label></div>
                    <div class="weui-cell__bd">
                        <div class="needsclick propaganda-con" contenteditable="true" id="slogan" placeholder='请输入宣传语'></div>
                    </div>
                </div>
            </div>
            <div class="full-end">
                <input type="button" class="weui-btn weui-btn_color" id="submit" value="下一步">
                <a href="/front/giveup-create-com" class="weui-btn weui-btn_color">放弃创建企业</a>
            </div>

    </div>

    <!--图片裁剪-->
    <div class="clipbg displaynone">
        <div id="clipArea"></div>
        <div class="loading displaynone">正在载入图片...</div>
        <div class="footer">
            <dl>
                <dd style="background: #fe1041; color: #ffffff;border: none;">打开相册<input type="file" id="file" accept="image/*" ></dd>
                <dd id="clipBtn">完成裁剪</dd>
            </dl>
            <div class="back">取消</div>
        </div>
    </div>
    <script src="/addons/phtotclip/hammer.min.js"></script>
    <script src="/addons/phtotclip/iscroll-zoom-min.js"></script>
    <script src="/addons/phtotclip/lrz.all.bundle.js?v=1"></script>
    <script src="/addons/phtotclip/photoClip.js?v=1"></script>
<script>
    $(document).ready(function () {
//        表单验证
        $("#submit").click(function () {
            var first = $(".company-name").text().length;
            var last = $(".propaganda-con").text().length;

            if (first==0||first >30) {
                $.toptip('请保持公司名称在30字内！');
                return false;/*阻止表单提交*/
            } else if (last==0||last>50) {
                $.toptip('请保持宣传语在50字内！')
                return false;/*阻止表单提交*/
            } else {
                ajax_init_create()
                return true;
            }
        })
        //上传头像start
        $(".btn-p").click(function(){
            $(".clipbg").fadeIn()
        })
        var clipArea = new  PhotoClip("#clipArea", {
            size: [300, 300],//裁剪框大小
            outputSize:[0,0],//打开图片大小，[0,0]表示原图大小
            file: "#file",
            ok: "#clipBtn",
            loadStart: function() { //图片开始加载的回调函数。this 指向当前 PhotoClip 的实例对象，并将正在加载的 file 对象作为参数传入。（如果是使用非 file 的方式加载图片，则该参数为图片的 url）
                $(".loading").removeClass("displaynone");

            },
            loadComplete: function() {//图片加载完成的回调函数。this 指向当前 PhotoClip 的实例对象，并将图片的 <img> 对象作为参数传入。
                $(".loading").addClass("displaynone");

            },
            done: function(dataURL) { //裁剪完成的回调函数。this 指向当前 PhotoClip 的实例对象，会将裁剪出的图像数据DataURL作为参数传入。
                $.ajax({
                    'url': '/admin/Upload/companyLogo',
                    'type': 'POST',
                    'data': {'dataURL': dataURL},
                    error: function (request) {
                        $.toptip("网络异常请重试",'warning');
                        setTimeout(function(){window.location.reload();},2000);
                    },
                    success: function (data) {
                        if (data.status == 'success') {
                            $.toptip("头像修改成功",'success');
                        } else {
                            $.toptip("网络异常请重试",'warning');
                            setTimeout(function(){window.location.reload();},2000);
                        }
                    }
                });
                $('.full-topimg').attr("src",dataURL);
                $(".clipbg").fadeOut();
            }
        });
        $(".back").click(function(){
            $(".clipbg").fadeOut();
        });
        //上传头像end
        $('.question-btn').click(function(){
            $.toast("上传的头像建议png格式", "text");
        })

    });

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    function ajax_init_create() {
        var url='/admin/init';
        var name = $("#name").text();
        var slogan = $("#slogan").text();
        $.ajax({
            type: 'post',
            cache: 'false',
            url: url,
            data: 'name=' + name + '&slogan=' + slogan,
            dataType: 'json',
            success: function (data) {
                if (data.status == 'success') {
                    $.toptip(data.msg,'success');
                    window.location.href= data.redirectUrl;
                } else {
                    $.toptip(data.msg,'error');
                    window.location.href= data.redirectUrl;
                }
            },
            error: function () {
                $.toptip('网络异常请重试','warning');
            }
        });
    }

</script>
@endsection
